<template>
  <div class="box">
    <h1>这是父传子案例</h1>

    <!-- 案例1 -->
    <!-- <v-zong-gong></v-zong-gong>
    <v-teng-xun></v-teng-xun>-->

    <!-- 案例2 -->
    <button @click="index=0">智能先锋</button>
    <button @click="index=1">家居优品</button>
    <button @click="index=2">超市百货</button>
    <v-zhi-neng v-show="index==0"></v-zhi-neng>
    <v-jia-ju v-show="index==1"></v-jia-ju>
    <v-chao-shi v-show="index==2"></v-chao-shi>


  </div>
</template>

<script>
import vZongGong from "./case1/vZongGong.vue";
import vTengXun from "./case1/vTengXun.vue";
import vZhiNeng from "./case2/vZhiNeng.vue";
import vJiaJu from "./case2/vJiaJu.vue";
import vChaoShi from "./case2/vChaoShi.vue";
export default {
  components: {
    vZongGong,
    vTengXun,
    vZhiNeng,
    vJiaJu,
    vChaoShi
  },
  data(){
    return {
        index:0
    }
  }
};
</script>

<style>
</style>